input {
    display: none;
}
.mask {
    position: fixed;
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    transition: all 0.3s ease;
    background: rgba(0, 0, 0, 0.5);
    opacity: 1;
    z-index: 2;
    visibility: visible;
}
.content {
    width: 588rpx;
    height: 570rpx;
    border-radius: 15rpx;
    position: fixed;
    left: 50%;
    top:35%;
    margin-left: -294rpx;
    margin-top: -285rpx;
    background: #fff;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
    z-index: 2;
    opacity: 1;
    visibility: visible;
    transition: all 0.3s ease;
}
.contenthide {
    margin-left: -350rpx;
    margin-top: -340rpx;
    width: 700rpx;
    height: 680rpx;
    opacity: 0;
    z-index: 0;
    visibility: hidden;
}
.visible {
    opacity: 0;
    z-index: 2;
    visibility: hidden;
}
.title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 80rpx;
    width: 560rpx;
    font-size: 32rpx;
}
.center {
    color: #333;
    font-size: 32rpx;
}
.close {
    width: 50rpx;
    height: 50rpx;	
}
image {
    width: 100%;
    height: 100%;
}
.pay-money {
    width: 525rpx;
    height: 240rpx;
    border-bottom: 1rpx solid #EBEBEB;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.pay-money view {
    width: 100%;
    height: 80rpx;
    display: flex;
    justify-content: center;
    align-items: center;
}
.pay-way {
    width: 520rpx;
    height: 85rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #8A8A8A;
    font-size: 28rpx;
}
.money {
    font-size: 45rpx;
    font-weight: 600;
    margin-bottom: 50rpx;
}
.money text {
    font-size: 60rpx;
    margin-left: 10rpx;
}
.pay-img {
    color: #333333;
    display: flex;
    justify-content: center;
    align-items: center;
}
.pay-img image {
    width: 35rpx;
    height: 35rpx;
    margin-right: 10rpx;
}
.code {
    width: 100%;
    height: 120rpx;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.code-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: 1px solid #d0d0d0;
}
.code-box-item {
    width: 86rpx;
    height: 86rpx;
    background: #fff;
    font-size: 40rpx;
    line-height: 75rpx;
    text-align: center;
}
.code-box-item:not(:last-child) {
    border-right: 1px solid #d0d0d0;
}
.keyboard {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #EBEBEB;
    display: flex;
    justify-content: center;
    z-index: 2;
    flex-wrap: wrap;
    transition:all 0.2s ease-in 0.2s;
}
.active {
    bottom: -400rpx;
}
.keyboard-item {
    box-sizing: border-box;
    width: 250rpx;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: #fff;
    font-size: 40rpx;
    color: #333;
    height: 99rpx;
    border: 1rpx solid #EBEBEB;
    border-top:none;
    border-left:none;
}
.hide {
    opacity: 0;
}
.delte {
    background: none;
    box-shadow: none;
}
.delte image {
    width: 60rpx;
    height: 60rpx;
}
.isIphone {
    padding-bottom: 68rpx !important;
}